<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link href="assets/css/bootstrap.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="css/style.css"/>
    <link href="assets/css/codemirror.css" rel="stylesheet">
    <link rel="stylesheet" href="assets/css/ace.min.css"/>
    <link rel="stylesheet" href="font/css/font-awesome.min.css"/>
    <!--[if lte IE 8]>
    <link rel="stylesheet" href="assets/css/ace-ie.min.css"/>
    <![endif]-->
    <script src="js/jquery-1.9.1.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/H-ui.js"></script>
    <script src="assets/js/typeahead-bs2.min.js"></script>
    <script src="assets/js/jquery.dataTables.min.js"></script>
    <script src="assets/js/jquery.dataTables.bootstrap.js"></script>
    <script src="assets/layer/layer.js" type="text/javascript"></script>
    <script src="assets/laydate/laydate.js" type="text/javascript"></script>
    <script src="assets/js/jquery.easy-pie-chart.min.js"></script>
    <script src="js/lrtk.js" type="text/javascript"></script>
    <style>
        #sample-table_filter {
            display: none !important;
        }

        #Delivery_stop .c-red {
            color: #F33;
        }
    </style>
    <title>积分商城</title>
</head>

<body>
<div class="margin clearfix">
    <div class="cover_style" id="cover_style">
        <!--内容-->
        <div class="centent_style" id="centent_style">
            <div id="covar_list" class="order_list">
                <div id="scrollsidebar" class="left_Treeview">
                    <div class="show_btn" id="rightArrow"><span></span></div>
                    <div class="widget-box side_content">
                        <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
                        <div class="side_list">
                            <div class="widget-header header-color-green2"><h4 class="lighter smaller">商品类型分类</h4></div>
                            <div class="widget-body">
                                <ul class="b_P_Sort_list">
                                    <li><i class="orange  fa fa-reorder"></i><a href="#">全部商品(235)</a></li>
                                    <li><i class="fa fa-sticky-note pink "></i> <a href="#">食品类(235)</a></li>
                                    <li><i class="fa fa-sticky-note pink "></i> <a href="#">数码配件(2215)</a></li>
                                    <li><i class="fa fa-sticky-note pink "></i> <a href="#">手机(3456)</a></li>
                                    <li><i class="fa fa-sticky-note pink "></i> <a href="#">电脑(4332)</a></li>
                                    <li><i class="fa fa-sticky-note pink "></i> <a href="#">厨房用品(1332)</a></li>
                                    <li><i class="fa fa-sticky-note grey "></i> <a href="#">电子商品(4543)</a></li>
                                    <li><i class="fa fa-sticky-note red  "></i> <a href="#">红钻会员(343)</a></li>
                                    <li><i class="fa fa-sticky-note blue "></i> <a href="#">家用电器(2343)</a></li>
                                    <li><i class="fa fa-sticky-note grey "></i> <a href="#">卫浴</a></li>
                                </ul>

                            </div>
                        </div>
                    </div>
                </div>
                <!--左侧样式-->
                <div class="list_right_style">
                    <div class="search_style">

                        <ul class="search_content clearfix">
                            <li><label class="l_f">商品名称</label><input name="" type="text" class="text_add"
                                                                      placeholder="输入商品名称" style=" width:200px">
                            </li><li><label class="l_f">企业名称</label><input name="" type="text" class="text_add"
                                                                      placeholder="输入商品名称" style=" width:200px"></li>
                            <li style="width:90px;">
                                <button type="button" class="btn_search"><i class="fa fa-search"></i>查询</button>
                            </li>
                            <li style="width:110px;">
                                <button type="button" class="btn_search" style="width: 100%;">可购买的商品
                                </button>
                            </li>
                            <li>积分: <span style="color: red">1502</span></li>
                            <li style="width:90px;float: right;">
                                <button type="button" onclick="javascript: window.location.href='personal_shopdd.html'" class="btn_search" style="width: 100%;">查看订单详情</button>
                            </li>
                        </ul>
                    </div>
                    <!--订单列表展示-->
                    <table class="table table-striped table-bordered table-hover" id="sample-table">
                        <thead>
                        <tr>
                            <th width="25px"><label><input type="checkbox" class="ace"><span class="lbl"></span></label>
                            </th>
                            <th width="60px">序号</th>
                            <th width="150px">发布企业</th>
                            <th width="150px">商品名称</th>
                            <th width="250px">商品图片</th>
                            <th width="100px">商品积分</th>
                            <th width="180px">所属类型</th>
                            <th width="200px">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td><label><input type="checkbox" class="ace"><span class="lbl"></span></label></td>
                            <td>1</td>
                            <td>小水果有限公司</td>
                            <td>橙子</td>
                            <td class="order_product_name">
                                <a href="#"><img src="products/p_1.jpg" title="商品名称"/></a>
                            </td>
                            <td>1000</td>
                            <td>食品</td>
                            <td>
                                <a onClick="Delivery_stop(this,'10001')" href="javascript:;" title="兑换"
                                   class="btn btn-xs btn-success"><i class="fa fa-cubes bigger-120"></i></a>
                            </td>
                        </tr>
                        <tr>
                            <td><label><input type="checkbox" class="ace"><span class="lbl"></span></label></td>
                            <td>2</td>
                            <td>小西瓜有限公司</td>
                            <td>橙子</td>
                            <td class="order_product_name">
                                <a href="#"><img src="products/p_1.jpg" title="商品名称"/></a>
                            </td>
                            <td>1000</td>
                            <td>食品</td>
                            <td>
                                <a onClick="Delivery_stop(this,'10001')" href="javascript:;" title="兑换"
                                   class="btn btn-xs btn-success"><i class="fa fa-cubes bigger-120"></i></a>
                            </td>
                        </tr>
                        <tr>
                            <td><label><input type="checkbox" class="ace"><span class="lbl"></span></label></td>
                            <td>3</td>
                            <td>小西瓜有限公司</td>
                            <td>橙子</td>
                            <td class="order_product_name">
                                <a href="#"><img src="products/p_1.jpg" title="商品名称"/></a>
                            </td>
                            <td>600</td>
                            <td>食品</td>
                            <td>
                                <a onClick="Delivery_stop(this,'10001')" href="javascript:;" title="兑换"
                                   class="btn btn-xs btn-success"><i class="fa fa-cubes bigger-120"></i></a>
                            </td>
                        </tr>
                        <tr>
                            <td><label><input type="checkbox" class="ace"><span class="lbl"></span></label></td>
                            <td>4</td>
                            <td>小西瓜有限公司</td>
                            <td>红枣</td>
                            <td class="order_product_name">
                                <a href="#"><img src="products/p_3.jpg" title="商品名称"/></a>
                            </td>
                            <td>800</td>
                            <td>食品</td>
                            <td>
                                <a onClick="Delivery_stop(this,'10001')" href="javascript:;" title="兑换"
                                   class="btn btn-xs btn-success"><i class="fa fa-cubes bigger-120"></i></a>
                            </td>
                        </tr>
                        <tr>
                            <td><label><input type="checkbox" class="ace"><span class="lbl"></span></label></td>
                            <td>5</td>
                            <td>小西瓜有限公司</td>
                            <td>红枣</td>
                            <td class="order_product_name">
                                <a href="#"><img src="products/p_3.jpg" title="商品名称"/></a>
                            </td>
                            <td>600</td>
                            <td>食品</td>
                            <td>
                                <a onClick="Delivery_stop(this,'10001')" href="javascript:;" title="兑换"
                                   class="btn btn-xs btn-success"><i class="fa fa-cubes bigger-120"></i></a>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!--兑换-->
<div id="Delivery_stop" style=" display:none">
    <div class="">
        <div class="content_style">
            <div class="form-group"><label class="col-sm-3 control-label no-padding-right" style="margin-top: -5px;"> 商品名称： </label>

                <div class="col-sm-9">
                    橙子
            </div>
                </div>
            <div class="form-group"><label class="col-sm-3 control-label no-padding-right"><span
                    class="c-red">*</span>数量：</label>

                <div class="col-sm-9"><input type="text" name="t" placeholder="数量" class="form-field-1 col-xs-10 col-sm-5"
                                             style="margin-left:0px;"></div>
            </div>
            <div class="form-group"><label class="col-sm-3 control-label no-padding-right">所需积分： </label>

                <div class="col-sm-9" id="num_change">0</div>
            </div>
            <div class="form-group"><label class="col-sm-3 control-label no-padding-right"><span
                    class="c-red">*</span>确认收货地址： </label>

                <div class="col-sm-9" id="num_change">
                    <select style=" width:250px" class="">
                        <option value="1">湖北武汉xx区xx路16号</option>
                        <option value="2">湖北武汉xx区xx路16号</option>
                        <option value="3">湖北武汉xx区xx路16号</option>
                    </select>
                </div>
            </div>
            <div class="form-group"><label class="col-sm-3 control-label no-padding-right"><span
                    class="c-red">*</span>确认收货人： </label>
                <div class="col-sm-9" id="num_change">
                    <select style=" width:100px" class="">
                        <option value="1">张三</option>
                        <option value="2">张三</option>
                        <option value="3">张三</option>
                    </select>
                </div>
            </div>
            <div class="form-group"><label class="col-sm-3 control-label no-padding-right"><span
                    class="c-red">*</span>确认电话号码： </label>
                <div class="col-sm-9" id="num_change">
                    <input type="text" name="t"  placeholder="13765123546" class="form-field-1 col-xs-10 col-sm-5"
                           style="margin-left:0px;">
                </div>
            </div>
            <div class="form-group"><label class="col-sm-3 control-label no-padding-right">备注： </label>

                <div class="col-sm-9"><input type="text" id="form-field-2" placeholder="请输入备注"
                                             class="col-xs-10 col-sm-5" style="margin-left:0px;"></div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>
    $(function () {
        $("input[name='t']").change(function () {
            var text = $(this).val();
            $("#num_change").text(text*1000);
        });
    });
    var oTable1 = $('#sample-table').dataTable({
//            "aaSorting": [[1, "desc"]],//默认第几个排序
        "bStateSave": false,//状态保存
        "aoColumnDefs": [
            //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
            {"orderable": false, "aTargets": [1, 2, 3,4, 5, 6]}// 制定列不参与排序
        ]
    });

    $(function () {
        $("#cover_style").fix({
            float: 'top',
            minStatue: false,
            skin: 'green',
            durationTime: false,
            window_height: 30,//设置浏览器与div的高度值差
            spacingw: 0,//
            spacingh: 0,//
            close_btn: '.yingchan_btn',
            show_btn: '.xianshi_btn',
            side_list: '.hide_style',
            widgetbox: '.top_style',
            close_btn_width: 60,
            da_height: '#centent_style,.left_Treeview,.list_right_style',
            side_title: '.b_n_btn',
            content: null,
            left_css: '.left_Treeview,.list_right_style'


        });
    });
    //左侧显示隐藏
    $(function () {
        $("#covar_list").fix({
            float: 'left',
            minStatue: false,
            skin: false,
            //durationTime :false,
            spacingw: 50,//设置隐藏时的距离
            spacingh: 270,//设置显示时间距
            stylewidth: '220',
            close_btn: '.close_btn',
            show_btn: '.show_btn',
            side_list: '.side_list',
            content: '.side_content',
            widgetbox: '.widget-box',
            da_height: null,
            table_menu: '.list_right_style'
        });
    });
    //时间选择
    //    laydate({
    //        elem: '#start',
    //        event: 'focus'
    //    });
    /*订单-删除*/
    function Order_form_del(obj, id) {
        layer.confirm('确认要删除吗？', function (index) {
            $(obj).parents("tr").remove();
            layer.msg('已删除!', {icon: 1, time: 1000});
        });
    }
    /**兑换**/
    function Delivery_stop(obj, id) {
        layer.open({
            type: 1,
            title: '兑换',
            maxmin: true,
            shadeClose: false,
            area: ['600px', ''],
            content: $('#Delivery_stop'),
            btn: ['确定', '取消'],
            yes: function (index, layero) {
                if ($('.form-field-1').val() == "") {
                    layer.alert('数量不能为空！', {
                        title: '提示框',
                        icon: 0,
                    })

                } else {
                    layer.confirm('已成功兑换,是否跳转到订单页面',function(index){
                        window.location.href="personal_shopdd.html";
                    });
                    layer.close(index);
                }

            }
        })
    }
    ;
    //面包屑返回值
    var index = parent.layer.getFrameIndex(window.name);
    parent.layer.iframeAuto(index);
    $('.Order_form,.order_detailed').on('click', function () {
        var cname = $(this).attr("title");
        var chref = $(this).attr("href");
        var cnames = parent.$('.Current_page').html();
        var herf = parent.$("#iframe").attr("src");
        parent.$('#parentIframe').html(cname);
        parent.$('#iframe').attr("src", chref).ready();
        ;
        parent.$('#parentIframe').css("display", "inline-block");
        parent.$('.Current_page').attr({"name": herf, "href": "javascript:void(0)"}).css({
            "color": "#4c8fbd",
            "cursor": "pointer"
        });
        //parent.$('.Current_page').html("<a href='javascript:void(0)' name="+herf+" class='iframeurl'>" + cnames + "</a>");
        parent.layer.close(index);

    });

    //初始化宽度、高度
    var heights = $(".top_style").outerHeight() + 47;
    $(".centent_style").height($(window).height() - heights);
    $(".page_right_style").width($(window).width() - 220);
    $(".left_Treeview,.list_right_style").height($(window).height() - heights - 2);
    $(".list_right_style").width($(window).width() - 250);
    //当文档窗口发生改变时 触发
    $(window).resize(function () {
        $(".centent_style").height($(window).height() - heights);
        $(".page_right_style").width($(window).width() - 220);
        $(".left_Treeview,.list_right_style").height($(window).height() - heights - 2);
        $(".list_right_style").width($(window).width() - 250);
    })
    //比例
    var oldie = /msie\s*(8|7|6)/.test(navigator.userAgent.toLowerCase());
    $('.easy-pie-chart.percentage').each(function () {
        $(this).easyPieChart({
            barColor: $(this).data('color'),
            trackColor: '#EEEEEE',
            scaleColor: false,
            lineCap: 'butt',
            lineWidth: 10,
            animate: oldie ? false : 1000,
            size: 103
        }).css('color', $(this).data('color'));
    });

    $('[data-rel=tooltip]').tooltip();
    $('[data-rel=popover]').popover({html: true});
</script>
<script>
    //订单列表
    jQuery(function ($) {
//        var oTable1 = $('#sample-table').dataTable( {
//            "aaSorting": [[ 1, "desc" ]],//默认第几个排序
//            "bStateSave": true,//状态保存
//            "aoColumnDefs": [
//                //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
//                {"orderable":false,"aTargets":[0,1,2,3,4,5,6,7,8,9]}// 制定列不参与排序
//            ] } );


        $('table th input:checkbox').on('click', function () {
            var that = this;
            $(this).closest('table').find('tr > td:first-child input:checkbox')
                    .each(function () {
                        this.checked = that.checked;
                        $(this).closest('tr').toggleClass('selected');
                    });

        });


    });
</script>